<template>
	<!-- 全真模拟 -->
	<view class="simulation pd-30">
		<u-navbar back-icon-color="#fff" title-color="#fff" title="考试管理" :border-bottom="false"></u-navbar>
		<view class="paper-list">
			<my-empty  v-if="emptyFlase" emptyTit="暂无数据"></my-empty>
			<uni-swipe-action v-else>
				<uni-swipe-action-item  :show="item.show" :index="index"
							v-for="(item,index) in list" :key="item.examId" 
							@click="click(index)" @open="open"
							:options="options"
						>
						<view class="paper-item"  @click="readmore(item.examId)">
							<view class="name">
								<text class="content">{{item.examName }}</text>
								<view v-if="item.noCommitCou==0"  style="color: #3E7DF1; font-size: 28upx;">
									全部已交
								</view>
								<view v-else style="color: #FFB62B; font-size: 28upx;">
									{{item.noCommitCou}}人未交
								</view>
							</view>
							<view class="name_bot">
								<view class="info">
									<my-icon name="time-slot"></my-icon>
									<text>{{item.startTime}}~{{item.endTime}}</text>
								</view>					
							</view>
						</view>
				</uni-swipe-action-item>
			</uni-swipe-action>
		</view>
		<my-confirm ref="headBack" @cancel="backCancel()" @confirm="conback()" confirm-text="确定" cancel-text="取消">您确定删除考试吗？</my-confirm>
	</view>
</template>

<script>
import exam from '../../mixins/exam.js';
/**
 * mode 3-全真模拟 4-组卷
 * */
export default {
	mixins: [exam],
	data() {
		return {
			list: [],
			show: false,
			options: [
				{text: '删除',
				style: {backgroundColor: '#dd524d'},
			  }
			],
			emptyFlase:false,
			choseData:{},//选择的考试
		};
	},
	onLoad() {
		this.init();
	},
	onShow() {
		if (uni.getStorageSync('chapterInfo')) {
			uni.removeStorage({
				key: 'chapterInfo'
			});
		}
	},
	methods: {
		init() {
			this.list = [];
			return this.getPageData();
		},
		click(data) {
			this.$refs.headBack.open();
			this.choseData=data;
		},
		// 如果打开一个的时候，不需要关闭其他，则无需实现本方法
		open(index) {
			// 先将正在被操作的swipeAction标记为打开状态，否则由于props的特性限制，
			// 原本为'false'，再次设置为'false'会无效
			this.list[index].show = true;
			this.list.map((val, idx) => {
					if(index != idx) this.list[idx].show = false;
			})
		},
		backCancel(){
			 this.$refs.headBack.close()
		},
		conback() {
			const delid=this.list[this.choseData].examId
			const choseIndex=this.choseData
			return new Promise((resolve, reject) => {
				this.request
					.delete('/app/teacher/home/deleteExam/'+delid,{'examid':delid})
					.then(res => {
					//模拟考试
				 	 this.list.splice(choseIndex, 1);
					 this.emptyFlase=this.list.length>0?false:true
					 this.$u.toast(`删除成功`);
					 this.$refs.headBack.close()
						resolve();
					})
			});
		},
		getPageData() {
			const { api, activeTab, moniPaper } = this;
			return new Promise((resolve, reject) => {
				this.request
					.get('/app/teacher/home/examMangage')
					.then(res => {
					//模拟考试
					 this.list = res;
					 this.emptyFlase=this.list.length>0?false:true
						resolve();
					})
			});
		},
		readmore(examId) {
			uni.navigateTo({
				url: 'examState?examId='+examId
			});
		},
	}
};
</script>
<style>
page {
	background-color: #f5f5f5;
}
</style>
<style scoped lang="scss">
.simulation {
	width: 100%;
	display: flex;
	flex-direction: column;
	// view {
	// 	position: relative;
	// }
}
.icon-dati{
		font-size: 40upx;
}
.paper-list {
	width: 100%;
	.paper-item {
		flex-direction: column;
		width: 100%;
		.name{
			display: flex;
			justify-content: space-between;
		}
		.info{
			display: flex;
			justify-content: start;
			align-items: center;
			text{
				font-size: 26upx;
				font-weight: 400;
				color: #a6a6a6;
			}
		}
	}
	.paper-item:last-child{
		border-bottom: 1px solid #EBEBEB;
	}
}

</style>
